<template>
  <div>
      <h3>通过商品名展示信息</h3>
      {{pro_name}}
       <table border="1" style="margin :0 auto;" width=500>
           <tr>
               <th>饮料编号</th>
               <th>饮料厂家</th>
               <th>饮料牌子</th>
               <th>饮料味道</th>
               <th>价格</th>
           </tr>
           <tr v-for="(item,i) in drinkList" :key="i">
               <td>{{item.id}}</td>
               <td>{{item.producer}}</td>
               <td>{{item.drink_name}}</td>
               <td>{{item.taste}}</td>
               <td>{{item.price}}</td>          
            </tr>
       </table>
  </div>
</template>

<script>
// import {get} from  '../../utils/request'
export default {
    name:'Show',
    data(){
        return{
            pro_name:this.$route.params.name,
            drinkList:[],
        }
    },
    mounted(){
        this.GetDrinkData();
    },
    methods:{
        GetDrinkData(){
            let url = 'drink2/?search=' + this.pro_name
            console.log(url)
            this.$axios.get(url).then(resp=>{
                console.log(resp);
                this.drinkList = resp.data;
            }).catch(err=>{
                console.log(err);
            })
        }
    }

}
</script>

<style>

</style>